import React from 'react';
import BraftEditor from 'braft-editor';
import './index.css'
import HTTP from '../../services/api';
import msgApi from '../../api/msg.api';
import { message, Avatar, Result, Modal, Input } from 'antd'

export default class EditMessage extends React.Component {
    state = {
        msg: '',
        isModalVisible: false,
        title: '',
        description: ""
    }

    changeEditContext = value => {
        console.log(value.toHTML())
    }
    SelfOnSave = value => {
        this.setState({ isModalVisible: true })
        this.setState({ description: value.toHTML() })
    }
    changeEditContext1 = value => {
        console.log('111111111111111111111111111111')
        console.log(value.toHTML())
    }
    createMsg = async (title, description) => {
        let result = await HTTP({ method: 'post' }, msgApi.MsgRestful, { title, description })
        try {
            if (result.status) {
                message.success(result.msg)
            } else {
                message.error(result.msg)
            }
        } catch (error) {
            message.error("服务器异常")
        }
    }

    handleOk = async () => {
        let { title, description } = this.state
        if (title && description) {
            console.log(title, description)
            await this.createMsg(title, description)
        } else {
            message.warn('标题或者内容缺失')
        }
        this.setState({ isModalVisible: false })
    }
    handleCancel = () => {
        this.setState({ isModalVisible: false })
    }
    render() {
        let { msg, isModalVisible } = this.state
        return (
            <div>
                <Modal
                    title="为此文章添加一个标题"
                    visible={isModalVisible}
                    onOk={() => { this.handleOk() }}
                    onCancel={() => { this.handleCancel() }} >
                    <Input onChange={value => { this.setState({ title: value.target.defaultValue }) }} placeholder="标题" />
                </Modal>
                <Result
                    style={{ height: '200px', padding: '10px 32px' }}
                    status="success"
                    icon={<Avatar size={98} src='/logo.svg' />}
                    title={this.props.msg ? this.props.msg : "XXX学校校医院病例系统"}
                    subTitle={this.props.msg ? "XXX学校校医院病例系统" : ''}
                />
                <BraftEditor
                    value={msg}
                    // onChange={this.changeEditContext}
                    onSave={value => this.SelfOnSave(value)}
                />
            </div>


        )
    }
}